<script setup>
//前端开发：先死后活法，前端页面数据都是死的，只有调用了后端的数据才是真正的动网
//导入axios
import axios from 'axios'
//导入ref
import { ref } from 'vue'
//导入user.js
import { usersGetAllService } from './api/user.js'
//定义响应数据
const users = ref([])
//获取所有用户信息
let data = usersGetAllService()
users.value  = data
</script>

<template>
<h2>用户信息列表</h2>
  <table>
    <tr>
      <th>ID</th>
      <th>用户名</th>
      <th>信息</th>
      <th>状态</th>
      <th>余额</th>
      <th>操作</th>
    </tr>
    <tr v-for="user in users">
      <td>{{ user.id }}</td>
      <td>{{ user.username }}</td>
      <td>{{ user.info }}</td>
      <td>{{ user.status }}</td>
      <td>{{ user.balance }}</td>
      <td>
        <button>编辑</button>
        <button>删除</button>
      </td>
    </tr>


  </table>
</template>

<style scoped>

</style>